<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <%@include file="/common/common.jsp" %>
    <link rel="stylesheet" href="${basePath}/plugins/ztree/zTreeStyle/zTreeStyle.css${VERSION}" type="text/css">
</head>
<body>
<div class="org">
    <div class="widget-header header-color-blue2">
        <h4 class="lighter smaller"> &nbsp;请选择部门</h4>
    </div>
    <div class="org-body">
        <div class="widget-main padding-8">
            <ul id="treeDemo" class="ztree"></ul>
        </div>
    </div>
</div>
<script src="${basePath}/plugins/ztree/jquery.ztree.core.js${VERSION}"></script>
<script type="text/javascript">
    <!--
    var setting = {
        async: {
            enable: true,
            url:"${basePath}/role/getRoleTree",
            otherParam:{"otherParam":"zTreeAsyncTest"},
            dataFilter: filter,
            dataType:"json",
            type: "get"
        },
        callback: {
            onClick: onClick
        }
    };

    function filter(treeId, parentNode, childNodes) {
        if (!childNodes) return null;
        var data = childNodes.data;
        for (var i=0, l=childNodes.length; i<l; i++) {
            data[i].name = data[i].name.replace(/\.n/g, '.');
        }
        return data;
    }

    var roleName;
    var roleId;
    function onClick(event, treeId, treeNode, clickFlag) {
        roleName = treeNode.name;
        roleId = treeNode.id;

    }

    $(document).ready(function(){
        $.fn.zTree.init($("#treeDemo"), setting);
    });
    //-->
</script>
</body>
</html>